/**
 * @description 组件样式
 * @author: 陈陈
 * @date: 2025/05/09
 * @phone: 18560000860
 * @email: 18560000860@qq.com
 * @company: 济南晨霜信息技术有限公司 /
 * @business: 承接前后端项目的开发
 */
.pure-loading-modal {
	width: 0;
	height: 0;
	color: var(--pure-loading-modal-color, var(--pure-text-color-invert));
	display: none;

	&__mask {
		width: 100%;
		height: 100%;
		position: fixed;
		z-index: var(--pure-loading-modal-z-index, var(--pure-z-index-upper));
		top: 0;
		left: 0;
		background: var(--pure-loading-modal-mask-background, var(--pure-background-mask));
		opacity: var(--pure-loading-modal-mask-opacity, 0);
		transition: all 200ms linear;
	}

	&__body {
		position: fixed;
		z-index: var(--pure-loading-modal-z-index, var(--pure-z-index-upper));
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%) scale(var(--pure-loading-modal-body-scale, 0));
		background: var(--pure-loading-modal-background, var(--pure-background-mask));
		padding: var(--pure-loading-modal-padding, 12px 16px);
		border-radius: var(--pure-loading-modal-border-radius, var(--pure-radius-default));
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: var(--pure-loading-modal-gap, 8px);
		opacity: var(--pure-loading-modal-body-opacity, 0);
		transition: all 200ms linear;
		width: var(--pure-loading-modal-width);
		height: var(--pure-loading-modal-height);
		margin: var(--pure-loading-modal-margin);
		max-width: var(--pure-loading-modal-max-width, 70%);
	}

	&__content {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: var(--pure-loading-modal-content-gap, 8px);
	}

	&__loading {
		line-height: 1;
		animation: animationPureSpin var(--pure-loading-modal-animation-duration, 1000ms)
			var(--pure-loading-modal-animation-timing-function, linear) 0s infinite;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: var(--pure-loading-modal-loading-font-size, var(--pure-font-size-large));
		color: var(--pure-loading-modal-loading-color);
		font-weight: var(--pure-loading-modal-loading-font-weight);
	}

	&__text {
		font-size: var(--pure-loading-modal-text-font-size);
		color: var(--pure-loading-modal-text-color);
		font-weight: var(--pure-loading-modal-text-font-weight);
	}

	&__close {
		position: var(--pure-loading-modal-close-position, static);
		width: var(--pure-loading-modal-close-size);
		height: var(--pure-loading-modal-close-size);
		right: var(--pure-loading-modal-close-right);
		top: var(--pure-loading-modal-close-top);
		transform: var(--pure-loading-modal-close-transform);
		color: var(--pure-loading-modal-close-color);
		background: var(--pure-loading-modal-close-background);
		border-radius: var(--pure-loading-modal-close-border-radius);
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		line-height: 1;
		font-size: var(--pure-loading-modal-close-font-size);
	}

	&--before-show,
	&--to-show,
	&--after-show,
	&--before-leave,
	&--to-leave {
		display: flex;
	}

	&--after-leave {
		display: none;
	}

	&--before-show {
		--pure-loading-modal-mask-opacity: 1;
		--pure-loading-modal-body-scale: 0;
		--pure-loading-modal-body-opacity: 0;
	}

	&--to-show,
	&--after-show,
	&--before-leave {
		--pure-loading-modal-mask-opacity: 1;
		--pure-loading-modal-body-scale: 1;
		--pure-loading-modal-body-opacity: 1;
	}

	&--to-leave {
		--pure-loading-modal-mask-opacity: 1;
		--pure-loading-modal-body-scale: 0;
		--pure-loading-modal-body-opacity: 0;
	}

	&--after-leave {
		--pure-loading-modal-mask-opacity: 0;
		--pure-loading-modal-body-scale: 0;
		--pure-loading-modal-body-opacity: 0;
	}

	&--vertical {
		.pure-loading-modal__body {
			padding: var(--pure-loading-modal-padding, 20px);
		}
		.pure-loading-modal__content {
			flex-direction: column;
		}
	}
}
